由於最近在研究 SwiftUI，所以就來跟大家分享一下。

專案建立

首先先從建立新專案開始，前面的步驟與建立 Swift 專案時一樣，直到出現下面的畫面。

我們需要在 Interface 那一欄選擇 SwiftUI，之後按下 Next。

環境介紹

建立好專案之後 Xcode 會自動生成檔案，左邊就是編寫程式的地方，右邊則是預覽畫面。

然後左邊的區域裡，大家可以在下面的 body 裡描述畫面的樣子，具體的方法之後會說明。

struct ContentView: View {
    var body: some View {
        VStack {
            Image(systemName: "globe")
                .imageScale(.large)
                .foregroundColor(.accentColor)
            Text("Hello, world!")
        }
        .padding()
    }
}

也可以在左邊的區域下方看到如下的程式碼，這是用來產生預覽畫面的。

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

而右邊預覽畫面裡還有一些額外的小功能可以協助開發，例如預覽畫面左下角由左至右分別是：

1. Live View
    在這個模式下可以跟畫面做互動，測試程式的運行狀況。 
2. Selectable
    在這個模式下選擇畫面上的物件，左邊對應的程式碼也會被選取，方便判斷物件，也能夠清楚的知道選中的物件的 View 的大小。
3. Variant
    可以清楚的看到不同模式下畫面的樣子，例如：淺色及深色模式、直的或橫的螢幕以及不同字體大小下的畫面。
4. Canvas Device Setting
    可以去設定畫面，淺色及深色模式、直的或橫的螢幕以及字體大小。
5. 實體裝置預覽
6. 放大縮小畫面

要是萬一不小心把預覽畫面關掉的話，點擊右上角中間的按鈕，把 Canvas 選取起來，預覽畫面就會出現了。

那今天就介紹到這裡，明天來介紹 App、Scene、View 這三個 Procotol。